import React from 'react';
import Footer from '../widget/footer/footer.jsx';
import GetTime from './radar/getTime.jsx';
import Action from './radar/action.jsx';
import Heat from './radar/heat.jsx';
import MpUrl from '@/route/getparam';
import { getIndexInfo, accountBrowseCard } from 'api/radar.js';
import { isLogin } from '@/api/user'
import './index.scss';
class Home extends React.Component{
	constructor (props) {
		super(props)
		this.state={
			navList: ['时间', '行为统计', '热度'],
			navNum: 0,
			dateList: [],
			content: '',
			nowIndex: 0
		}
	}
	componentWillMount () {
		document.title = '雷达';
		let getUrl = new MpUrl()
		// accountBrowseCard({
		// 	index: this.state.nowIndex
		// }).then(res => {
		// 	this.setState({
		// 		dateList: res.data.content,
		// 		nowIndex: res.data.index
		// 	}, () => {
		// 		this.setState({
		// 			content: <GetTime dateList={this.state.dateList} />
		// 		})
		// 	})
		// })
		// sessionStorage.setItem('company_id', 10000)
		
		if (getUrl.get('code')) {
			isLogin().then(res => {
				if (res.code === 1) {
					if(sessionStorage.getItem('company_id') === null){
						sessionStorage.setItem('company_id', getUrl.get('company_id'))
					}
					accountBrowseCard({
						index: this.state.nowIndex
					}).then(res => {
						this.setState({
							dateList: res.data.content,
							nowIndex: res.data.index
						}, () => {
							this.setState({
								content: <GetTime dateList={this.state.dateList} />
							})
						})
					})
				} else {
					getIndexInfo({
					 	company_id: getUrl.get('company_id'),
						apps_agent_id: 1000002,
						code: getUrl.get('code')
					}).then(res => {
						if (res.code === 1) {
							sessionStorage.setItem('company_id', getUrl.get('company_id'))
							accountBrowseCard({
								index: this.state.nowIndex
							}).then(res => {
								this.setState({
									dateList: res.data.content,
									nowIndex: res.data.index
								}, () => {
									this.setState({
										content: <GetTime dateList={this.state.dateList} />
									})
								})
							})
						}
					})
				}
			})
		} else {
			if (navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1) {
				 window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=ww0f1092726464b49d&redirect_uri=' +
            encodeURIComponent(window.location.href) +
            '&response_type=code&scope=snsapi_userinfo&agentid=1000002&state=req#wechat_redirect'
			} else {
				// console.log('小小雪大魔王')
			}
		}
	}
	show (index) { //选项卡
		this.setState({
			navNum: index
		},() => {
			if (index === 0){
				this.setState({
					content: <GetTime dateList={this.state.dateList}/>
				})
			} else if (index === 1){
				this.setState({
					content: <Action/>
				})
			} else if (index === 2){
				this.setState({
					content: <Heat/>
				})
			}
		})
	}
	componentDidMount () {
		let that = this;
    window.onscroll= function(){
      var t = document.documentElement.scrollTop||document.body.scrollTop;
      var b = document.documentElement.scrollHeight||document.body.scrollHeight;
      var h = document.documentElement.clientHeight||document.body.clientHeight;
      if((+t+h) == b && t!==0 && that.state.nowIndex !== 0){
        accountBrowseCard({
					index: that.state.nowIndex
				}).then(res => {
					that.setState({
						dateList: [...that.state.dateList, ...res.data.content],
						nowIndex: res.data.index
					}, () => {
						that.setState({
							content: <GetTime dateList={that.state.dateList}/>
						})
					})
				})
      }
    }
	}
	render() {
		return(
			<div className='randar'>
				{/*<div className="title">
					<div><i className="glyphicon glyphicon-close"></i></div>
					<div>雷达</div>
					<div><i className="glyphicon glyphicon-options"></i></div>
				</div>*/}
				<div className="header">
					{
						this.state.navList.map((item,index) => {
							return(
								<div onClick={this.show.bind(this,index)} className={this.state.navNum === index ? 'cardActive' : undefined} key={index}>
									{item}
								</div>
							)
						})
					}
				</div>
				<div className="content">
					{this.state.content}
				</div>
				<Footer/>
			</div>
			)
	}
}
export default Home;